<template>
    <div>
        <span style="font-size: 25px;margin-left: 50px"><b>案件信息</b></span>
        <hr style="border: 1px dashed darkgray;width: 1360px;transform: scaleY(0.5);margin-bottom: 25px">
        <el-table
                :data="caseStandard"
                border
                style="width: 1325px;margin-left: 60px;margin-bottom: 30px">
            <el-table-column
                    prop="caseNo"
                    label="案号"
                    width="180"
                    align="center">
            </el-table-column>
            <el-table-column
                    prop="caseWtr"
                    label="委托人"
                    width="180"
                    align="center">
            </el-table-column>
            <el-table-column
                    prop="caseCause"
                    label="案由"
                    align="center">
            </el-table-column>
            <el-table-column
                    prop="caseLawsuitStatus"
                    label="诉讼地位"
                    align="center">
            </el-table-column>
            <el-table-column
                    prop="caseStatus"
                    label="诉讼阶段"
                    align="center">
            </el-table-column>
            <el-table-column
                    prop="caseAgencyfee"
                    label="代理费"
                    align="center">
            </el-table-column>
        </el-table>
        <span style="font-size: 25px;margin-left: 50px;"><b>减免申请</b></span>
        <hr style="border: 1px dashed darkgray;width: 1360px;transform: scaleY(0.5);margin-bottom: 25px">
        <el-form :model="cdForm" ref="cdForm" :rules="rules3" label-width="110px" class="demo-cdForm" onsubmit="return false">
            <el-row>
                <el-col :span="10" :offset=1>
                    <el-form-item label="申请人" prop="person">
                        <el-input v-model="cdForm.person" placeholder="请输入申请人" readonly></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="10" :offset=1>
                    <el-form-item label="申请减免金额" prop="decreaseMoney">
                        <el-input v-model.number="cdForm.decreaseMoney" placeholder="请输入申请减免金额"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="10" :offset=1>
                    <el-form-item label="申请日期" prop="applyDate">
                        <el-date-picker type="date" placeholder="选择申请日期" v-model="cdForm.applyDate " style="width: 100%;"></el-date-picker>
                    </el-form-item>
                </el-col>
                <el-col :span="10" :offset=1>
                    <el-form-item label="相关文件" prop="filepath">
                        <el-button type="primary" @click="fileUp">上传文件<i class="el-icon-upload el-icon--right"></i></el-button>
                        <el-upload
                                class="upload-demo"
                                ref="upload"
                                action=""
                                :limit="1"
                                :http-request="submitUpload"
                                :before-upload="beforeUpload"
                                :on-exceed="onExceed"
                                v-show="false">
                            <el-button ref="xzwj">选取文件</el-button>
                        </el-upload>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="21" :offset=1>
                    <el-form-item label="备注" prop="reason">
                        <el-input type="textarea" v-model="cdForm.reason"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-form-item>
                <el-row>
                    <el-col :span="1" :offset=9>
                        <el-button type="primary" @click="clientFormSubmit('cdForm')" style="margin-left: -10px">立即创建</el-button>
                    </el-col>
                    <el-col :span="1" :offset=2>
                        <el-button @click="resetForm('cdForm')">重置</el-button>
                    </el-col>
                </el-row>
            </el-form-item>
        </el-form>
    </div>
</template>

<script>
    import AddCaseService from "../../model/AddCaseService";

    const addCaseService=AddCaseService.getInstance();
    export default {
        name: "CaseReduction",
        props:[
            'caseId'
        ],
        data(){
            return{
                files:'',//文件
                fileName:'',//文件名
                caseStandard:[],//表格数据

                cdForm:{//费用减免申请表单
                    caseLawId:"",//案号id
                    person:"",//申请人
                    decreaseMoney:"",//申请减免金额
                    applyDate:"",//申请日期
                    filepath:"",//相关文件
                    reason:"",//备注
                },
                rules3:{//费用减免申请表单验证规则
                    person:[
                        {required:true,message:"请输入申请人!",trigger:"blur"}
                    ],
                    decreaseMoney:[
                        {type:"number",required:true,message:"请正确输入申请减免金额!",trigger:"blur"}
                    ],
                    applyDate:[
                        {required:true,message:"请输入申请日期!",trigger:"blur"}
                    ],
                    reason:[
                        {required:true,message:"请填写备注信息!",trigger:"blur"}
                    ]
                },
            }
        },
        created() {
            this.init()
        },
        methods:{
            init(){
                this.cdForm.caseLawId=this.caseId;
                const params={
                    id:this.caseId
                };
                addCaseService.querySenior(this.$http,params).then(msg=>{
                    this.caseStandard=msg.data.data.list;
                    this.cdForm.person=msg.data.data.list[0].caseWtr
                });
            },
            fileUp(){//文件上传点击事件
                this.$refs.xzwj.$el.click()
            },
            onExceed(){//文件个数超出限制时
                this.$message({
                    type:"warning",
                    message:"本次文件上传已达限制"
                })
            },
            beforeUpload(file){//文件上传之前
                this.files=file;
                this.fileName=file.name;
            },
            submitUpload() {//文件上传提交事件
                if (this.fileName === "") {
                    this.$message.warning('请选择要上传的文件！');
                    return false
                }
                let fileFormData = new FormData();
                fileFormData.append('file', this.files, this.fileName);//file是键，files是值，就是要传的文件，fileName是要传的文件名
                let requestConfig = {
                    headers: {
                        'Content-Type': 'multipart/form-data'
                    },
                };
                addCaseService.fileUp(fileFormData,requestConfig,this.$http).then(msg=>{
                    this.cdForm.filepath=msg.data.data
                    this.$message({
                        type:"success",
                        message:"上传成功~"
                    })
                })
            },
            clientFormSubmit(formName) {//提交表单
                this.$refs[formName].validate((valid) => {
                    if (valid) {
                        this.cdForm.applyDate=this.$date.formatDate(this.cdForm.applyDate, "yyyy-MM-DD");
                        let formData = new FormData();
                        for(const key in this.cdForm){
                            if(Object.prototype.hasOwnProperty.call(this.cdForm, key)){
                                if(this.cdForm[key]!=null){
                                    formData.append(key,this.cdForm[key]);
                                }
                            }
                        }
                        addCaseService.addCaseDecrease(this.$http,formData).then(msg=> {
                            if (msg.data.status === "50000") {
                                this.$message({
                                    type: "error",
                                    message: "出错了呢~"
                                })
                            } else {
                                this.$message({
                                    type: "success",
                                    message: "提交成功~"
                                });
                                const param = new URLSearchParams();
                                param.append("id", this.caseId);
                                param.append("standard", this.cdForm.decreaseMoney);
                                param.append("caseUnpaidsal",this.cdForm.decreaseMoney);
                                param.append("type",1);
                                addCaseService.upCaseLaw(this.$http, param);
                                this.$emit("changeActive")
                            }
                        })
                    }
                });
            },
            resetForm(formName) {//重置表单
                this.$refs[formName].resetFields();
            },
        }
    }
</script>

<style scoped>

</style>